import React, { Component } from 'react'
import Navigation from 'components/Navigation/Navigation'
import back from 'images/home/task/a@3x.png'
import search from 'images/home/sousuo@2x.png'
import down from 'images/home/down@2x.png'
import dh from 'images/home/dh@2x.png'
import dizhi from 'images/home/dizhi@2x.png'
import cancel from 'images/home/cancel.png'
import {ChooseLocaTionContainer,HotSchoolContainer} from './StyledChildView'
const arrsch = [
    {   
        sTag:100,
        sName:"清华大学"
    },
    {
        sTag:101,
        sName:"北京大学"
    },
    {
        sTag:102,
        sName:"北京邮电大学"
    },
    {
        sTag:103,
        sName:"中央美术学院"
    },
    {
        sTag:104,
        sName:"北京科技大学"
    },
    {
        sTag:105,
        sName:"北京科技职业技术学院"
    }
]
export default class ReChooseLocationL extends Component {

   state={
        isShow:false,
        
    }
    render() {
        return (
            <ChooseLocaTionContainer>
                 <Navigation
                title = "选择地址"
                backgroundColor='#fff'
                titleColor="#646464"
                fontSize=".18rem"
                leftMargin = '0 0 0 .15rem'
                titleSize = '.17rem'
                leftWidth = '25%'
                leftHeight = '.44rem'
                leftImg = {back}
                leftImgWidth = '.2rem'
                clickLeft = {()=>this.onClickLeft("left")}
                ></Navigation>
                <div className="lContent">
                    <form action="" className="lForm">
                    <img className="search" src={search} alt=""/>
                    <input type="text" name="" className="inpContent" placeholder="输入地址名称"/>
                    </form>
                </div>
                <div className="lWrapper">
                    <div className="lText">
                        <p>定位/最近访问</p>
                        <p>
                            切换学校
                            <img src={down} className="downIcon" onClick={()=>this.downChange()} alt=''/>
                        </p>
                    </div>
                   
                    <div className="currentLoca">
                        <div className="curText">
                            <p>
                                <img src={dizhi} className="dizhi" onClick={this.currentLocationChange} alt=""/>
                                当前地址
                            </p>
                            <p>
                                重新定位
                                <img src={dh} className="dh" onClick={()=>this.reLocationChange()} alt=""/>
                            </p>
                        </div>
                        <div className="usedLoca">
                            <ul>
                                <li>
                                   北京科技职业技术学院
                                </li>
                               
                            </ul>
                        </div>
                    </div>
                </div>


                <HotSchoolContainer>
                  

                    
                    <div className="hotSc">
                      <h3>热门学校</h3>
                      <div className="schoolName">
                          <ul>
                             {
                                 arrsch.map((value,index)=>(
                                     
                                    <li key={value.sTag}>{value.sName}</li>
                                 ))
                             }
                          </ul>
                      </div>
                    </div>
                 
                </HotSchoolContainer>
                {
                    this.state.isShow ? (
                       <div className="mask">
                            <img className='cancel-img' src={cancel}  onClick={()=>this.handleHide()} alt=""/>
                            <div className="innerMask"></div>
                       </div> 
                    ) : ""
                
                }
               
            </ChooseLocaTionContainer>
        )
    }
    onClickLeft(tag){
        this.props.history.go(-1)
    
      }
    downChange(){
        console.log("弹出定位")
        this.setState({
            isShow:!(this.state.isShow)
        })
    }
    handleHide(){
        this.props.history.go(0)
       
    }
    currentLocationChange(){
        console.log("当前定位")
    }
    reLocationChange(){
        console.log('重新选择定位')
        this.props.history.push('/homeChildRouter/map')
    }
}
